<template>
    <!--  筛选组织并选择岗位 -->
    <a-modal
        destroyOnClose
        title="选择第一责任人"
        width="660px"
        :visible="visible"
        :confirm-loading="confirmLoading"
        @ok="handleOk"
        @cancel="handleCancel"
    >
        <a-form-model
            ref="ruleForm"
            :model="form"
            :rules="rules"
            :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
            :wrapperCol="{ lg: { span: 16 }, sm: { span: 16 } }"
            style="padding-right: 60px"
            v-if="visible"
        >
            <a-row :gutter="24">
                <a-col :md="24" :sm="24">
                    <a-form-model-item label="组织" prop="orgSelectedName" class="requiredFormItem">
                        <TreeSelectOrganization
                            v-model="form.orgSelectedName"
                            :orgQuery="orgQuery"
                            :orgSelectedValue.sync="form.orgSelectedName"
                            :orgSelectedLabel.sync="form.orgSelectedLabel"
                            :childrenNode="childrenNode"
                            :screening="screening"
                        ></TreeSelectOrganization>
                    </a-form-model-item>
                </a-col>
                <a-col :md="24" :sm="24">
                    <a-form-model-item label="岗位" prop="jobsSelectedId" class="requiredFormItem">
                        <Jobs
                            v-model="form.jobsSelectedId"
                            :treeCheckable="treeCheckable"
                            :selectedValue.sync="form.jobsSelectedId"
                            :selectedLabel.sync="form.jobsSelectedName"
                            :addTitel="form.orgSelectedLabel&&form.orgSelectedLabel[0]"
                            :isThreeLevel="true"
                            @job-change="handleChange"
                            @job-select="handleSelect"
                        ></Jobs>
<!--                      :selectedValue.sync="form.jobsSelectedId"-->
<!--                      :selectedLabel.sync="form.jobsSelectedName"-->
                    </a-form-model-item>
                </a-col>
            </a-row>
        </a-form-model>
    </a-modal>
</template>

<script>
import { bindUserOrg } from '@/api/system/system'
import TreeSelectOrganization from '@/components/TreeSelectOrganization'
import Jobs from '@/components/TreeSelectOrganization/jobs'
export default {
    name: 'modalBindOrg',
    components: {
        TreeSelectOrganization,
        Jobs,
    },
    props: {
        visible: {
            value: false,
            type: Boolean,
        },
        id: {
            type: String,
            default: '',
        },
        orgQuery: {
            type: Object,
            default: {},
        },
        screening: {
            type: Boolean,
            default: false,
        },
        formData: {
            type: Object,
            default: null,
        },
    },

    data() {
        return {
            rules: {
                orgSelectedName: [{ required: true, message: '请选择组织', trigger: 'change' }],
                jobsSelectedId: [{ required: true, message: '请选择岗位', trigger: 'change' }],
            },
            treeCheckable: false,
            confirmLoading: false,
            childrenNode: 'jobs',
            form: {
                orgSelectedName: undefined,
                orgSelectedLabel: undefined,
                jobsSelectedId: undefined,
                jobsSelectedName: undefined,
            },
            jobSelected:{
               id: undefined,
               name: undefined
            }
        }
    },
    created() {},
    methods: {
      handleChange(jobId,jobName){
        this.jobSelected.id = jobId
        this.jobSelected.name = jobName
      },
      handleSelect(jobId,jobName){

      },
        /**
         *@desc  table列表密码重置提交
         *@param {}
         */
        handleOk() {
            this.$refs.ruleForm.validate((err, value) => {
                if (err) {
                    this.$emit('handleOk', this.form)
                    this.$emit('job-selected', this.jobSelected)
                    this.$refs.ruleForm.resetFields()
                }
            })
        },
        /**
         *@desc  table列表密码重置取消
         *@param {}
         */
        handleCancel(e) {
            this.$refs.ruleForm.resetFields()
            this.$emit('handleCancelFirstRes', false)
        },
    },
}
</script>

<style>
</style>
